import { defineConfig, loadEnv } from 'vite';
import type { Plugin, ResolvedConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import eslintPlugin from 'vite-plugin-eslint';
import path from 'path';
import vueJsx from '@vitejs/plugin-vue-jsx';
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
import Components from 'unplugin-vue-components/vite';
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
import copy from 'rollup-plugin-copy';
import unElementPlus from 'unplugin-element-plus/vite';

export default defineConfig(({ mode }) => {
  // 添加第三个参数空字符串时 '' ,会在env中包含所有环境变量；反之，只包含.env文件中配置的环境变量
  const env = loadEnv(mode, process.cwd(), '');
  const config = {
    server: {
      host: '0.0.0.0',
      port: 3000,
      // base:'./',  //生成环境路径
      proxy: {
        '^/api': {
          target: env.VITE_APP_BASE_API,
          ws: true,
          changeOrigin: true,
          rewrite(path) {
            const res = path.replace(/^\/api/, '');
            console.log(this.target, ' -> ', res); // vite这样打印代理日志
            return res;
          }
        },
        '/services-api': {
          target: env.VITE_APP_BASE_API,
          changeOrigin: true,
          rewrite(path) {
            console.log(this.target, ' -> ', path); // vite这样打印代理日志
            return path;
          }
        },
        '/system': {
          target: env.VITE_APP_BASE_API,
          changeOrigin: true,
          rewrite(path) {
            console.log(this.target, ' -> ', path); // vite这样打印代理日志
            return path.replace(/^\/system/, 'system');
          }
        },
        '/socket': {
          target: 'ws://localhost:3000',
          ws: true,
          rewrite: (path) => path.replace(/^\/socket/, "")
        }
      }
    },
    plugins: [
      vue(),
      vueJsx(),
      createSvgIconsPlugin({
        iconDirs: [path.resolve(process.cwd(), 'src/assets/icons/svg')], //svg图片存放的目录
        symbolId: 'icon-[name]', // symbol的id
        inject: 'body-last', // 插入的位置
        customDomId: '__svg__icons__dom__' // svg的id
      }),
      eslintPlugin({
        include: [
          'src/**/*.ts',
          'src/**/*.tsx',
          'src/**/*.js',
          'src/**/*.vue',
          'src/*.ts',
          'src/*.js',
          'src/*.vue'
        ]
      }),
      copy({
        targets: [
          // { src: 'public', dest: 'dist' }  // 打包时复制指定目录或文件到打包位置
        ]
      })
    ],
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src'),
        '~@': path.resolve(__dirname, 'src'),
        '@_C': path.resolve(__dirname, 'src/components')
      },
      extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue']
    },
    esbuild: {
      jsxFactory: 'h',
      jsxFragment: 'Fragment'
    },
    css: {
      //css预处理
      preprocessorOptions: {
        scss: {
          /*
          引入var.scss全局预定义变量，
          如果引入多个文件，
          可以使用
          '@import "@/assets/scss/globalVariable1.scss";@import "@/assets/scss/globalVariable2.scss";'
          这种格式
        */
          additionalData: '@use "@/assets/styles/variables.scss" as *;'
        }
      }
    }
  };
  if (mode !== 'development') {
    config.plugins.push(
      unElementPlus({
        useSource: true
      })
    );
    config.plugins.push(
      Components({
        dirs: [],
        dts: true,
        resolvers: [ElementPlusResolver()]
      })
    );
  }

  return config;
});
